<template>
	<view class="subscribe">
		<view class="list">
			<view>
			<view>
				<view>姓名</view>
				<view><input type="text" value="" placeholder="请输入名字"/></view>
			</view>
			<view>
				<view>手机号</view>
				<view><input type="number" value="" placeholder="请输入手机号"/></view>
			</view>
			<view @click="open">
				<view>日期</view>
				<view>
					<u-calendar v-model="show" :mode="mode" @change="change" max-date='2050-12-31'></u-calendar>
					<view v-show="!showw">{{data}}</view><view v-show="showw">请选择日期</view>
				</view>
			</view>
			<view>
				<view>时间段</view>
				<view><input type="text" value="" placeholder="请输入时间"/></view>
			</view>
			<view style="height: 160rpx;">
				<view style=' line-height: 160rpx;'>意向</view>
				<view><u-checkbox-group @change="checkboxGroupChange">
			<u-checkbox 
				@change="checkboxChange" 
				v-model="item.checked" 
				v-for="(item, index) in list" :key="index" 
				:name="item.name"
			>{{item.name}}</u-checkbox>
		</u-checkbox-group></view>
			</view>
			<view>
				<view>付款</view>
				<view><u-radio-group v-model="value" @change="radioGroupChange">
			<u-radio 
				@change="radioChange" 
				v-for="(item, index) in list1" :key="index" 
				:name="item.name"
				:disabled="item.disabled"
			>
				{{item.name}}
			</u-radio>
		</u-radio-group></view>
			</view>
			<view>
				<view>预算</view>
				<view><input type="text" value="" placeholder="请输入预算"/></view>
			</view>
			<view>
				<view>意向区域</view>
				<view><input type="text" value="" placeholder="意向区域"/></view>
			</view>
			<view>
				<view>意向楼盘</view>
				<view><input type="text" value="" placeholder="意向楼盘"/></view>
			</view>
			<view>
				<view>意向平方</view>
				<view><input type="text" value="" placeholder="意向平方"/></view>
			</view>
			<view>
				<view>房屋要求</view>
				<view><input type="text" value="" placeholder="房屋要求"/></view>
			</view>
			<view>
				<view>看房人数</view>
				<view><input type="number" value="" placeholder="请输入看房人数"/></view>
			</view>
			</view>
		</view>
		<view class="site">
			<u-button type="warning" @click="add">提交</u-button>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				show: false,
				showw: true,
				mode: 'date',
				data:'',
				list: [
				{
					name: '投资',
					checked: false,
					disabled: false
				},
				{
					name: '自住',
					checked: false,
					disabled: false
				},
				{
					name: '婚房',
					checked: false,
					disabled: false
				},
				{
					name: '置换',
					checked: false,
					disabled: false
				},
				{
					name: '度假',
					checked: false,
					disabled: false
				},
				{
					name: '养老',
					checked: false,
					disabled: false
				},
			],
			list1: [
							{
								name: '首付',
								disabled: false
							},
							{
								name: '全款',
								disabled: false
							},
							{
								name: '分期',
								disabled: false
							}
						],
						value: '首付',
			}
		},
		methods:{
		radioChange(e) {
			// console.log(e);
		},
		// 选中任一radio时，由radio-group触发
		radioGroupChange(e) {
			// console.log(e);
		},
		checkboxChange(e) {
			// console.log(e);
		},
		// 选中任一checkbox时，由checkbox-group触发
		checkboxGroupChange(e) {
			console.log(e);
		},
		open(){
				this.show = true
			},
		change(e) {
		console.log(this.data=e.result);
		this.showw = false
		},
		add(){
			uni.switchTab({
				url:'../../pages/My/My'
			})
		}
		}
	}
</script>

<style>
	page {
			background-color: #f5f5f5;
		}
		.site{
			width: 90%;
			margin: 0 auto;
		}
		.list{
			width: 96%;
			margin: 0 auto;
		}
		.list>view{
			width: 96%;
			margin-top: 10rpx;
			margin-bottom: 20rpx;
		}
		.list>view>view{
			background-color: #FFFFFF;
			height: 100rpx;
			line-height: 100rpx;
			display: flex;
			margin-top: 4rpx;
			font-size: 36rpx;
		}
		.list>view>view>view:nth-child(1){
			margin-left: 30rpx;
			width: 160rpx;
		}
		.list>view>view>view:nth-child(2){
			margin-left: 20rpx;
		}
		input{
			height: 100rpx;
			line-height: 100rpx;
		}
</style>
